// @flow
import { createAction, handleActions, type ActionType } from 'redux-actions';
import produce from 'immer';
import { delay } from 'redux-saga';
import { takeLatest, takeEvery, take, put, call, select } from 'redux-saga/effects';
import { REQUEST, SUCCESS, FAILURE, SagaTypeCreate } from 'utils/sagaUtils';
import { strict } from 'assert';
import { string } from 'postcss-selector-parser';

const LOAD_MENU_DATA = SagaTypeCreate('base/LOAD_MENU_DATA');
const SHOW_USER_MENU = 'base/SHOW_USER_MENU';
const HIDE_USER_MENU = 'base/HIDE_USER_MENU';
const SET_FULLSCREEN_LOADER = 'base/SET_FULLSCREEN_LOADER';
const ENTER_LANDING = 'base/ENTER_LANDING';
const EXIT_LANDING = 'base/EXIT_LANDING';
const SET_ERROR_MESSAGE = 'base/SET_ERROR_MESSAGE';
const CLEAE_ERROR_MESSAGE = 'base/CLEAE_ERROR_MESSAGE';
const SET_WIDTH = 'base/SET_WIDTH';

export interface BaseActionCreators {
  showUserMenu(): any;
  hideUserMenu(): any;
  setFullscreenLoader(visibility: boolean): any;
  exitLanding(): any;
  enterLanding(): any;
  setErrorMessag(message: string): any;
  clearErrorMessage(): any;
  setWidth(width: number): any;
}

export const actionCreators: BaseActionCreators = {
  loadMenuData: createAction(LOAD_MENU_DATA),
  showUserMenu: createAction(SHOW_USER_MENU),
  hideUserMenu: createAction(HIDE_USER_MENU),
  setFullscreenLoader: createAction(SET_FULLSCREEN_LOADER, (visibility: boolean) => visibility),
  exitLanding: createAction(EXIT_LANDING),
  enterLanding: createAction(ENTER_LANDING),
  setErrorMessag: createAction(SET_ERROR_MESSAGE, (message: string) => message),
  clearErrorMessage: createAction(CLEAE_ERROR_MESSAGE),
  setWidth: createAction(SET_WIDTH, (width: number) => width),
};
type ShowUserMenuAction = ActionType<typeof actionCreators.showUserMenu>;
type HideUserMenuAction = ActionType<typeof actionCreators.hideUserMenu>;
type SetFullscreenLoaderAction = ActionType<typeof actionCreators.setFullscreenLoader>;
type SetErrorMessagAction = ActionType<typeof actionCreators.setErrorMessag>;
type SetWidthAction = ActionType<typeof actionCreators.setWidth>;
export type Base = {
  userMenu: boolean,
  menuCurrent: string,
  fullscreenLoader: boolean,
  landing: boolean,
  windowWidth: number,
  errorMessage: { text: string, isError: boolean, showTime: number },
};

const initialState: Base = {
  userMenu: false,
  menuCurrent: 'Home',
  fullscreenLoader: false,
  landing: true,
  windowWidth: 1920,
  errorMessage: { text: '', isError: false, showTime: 6 },
};
const reducers = handleActions(
  {
    [SHOW_USER_MENU]: state => produce(state, (draft) => {
      draft.userMenu = true;
    }),
    [HIDE_USER_MENU]: state => produce(state, (draft) => {
      draft.userMenu = false;
    }),
    [SET_FULLSCREEN_LOADER]: (state, action: SetFullscreenLoaderAction) => {
      return produce(state, (draft) => {
        draft.fullscreenLoader = action.payload;
      });
    },
    [EXIT_LANDING]: (state) => {
      return produce(state, (draft) => {
        draft.landing = false;
      });
    },
    [ENTER_LANDING]: (state) => {
      return produce(state, (draft) => {
        draft.landing = true;
      });
    },
    [SET_ERROR_MESSAGE]: (state, action: SetErrorMessagAction) => {
      return produce(state, (draft) => {
        draft.errorMessage.text = action.payload;
        draft.errorMessage.isError = true;
      });
    },
    [CLEAE_ERROR_MESSAGE]: (state) => {
      return produce(state, (draft) => {
        draft.errorMessage.text = '';
        draft.errorMessage.isError = false;
      });
    },
    [SET_WIDTH]: (state, action: SetWidthAction) => {
      return produce(state, (draft) => {
        draft.windowWidth = action.payload;
      });
    },
  },
  initialState,
);
const effects = function* RootSaga(): * {
  yield takeLatest(SET_ERROR_MESSAGE, function* setE(action: SetErrorMessagAction) {
    // const user = yield call(Api.fetchUser, action.payload.userId);
    // yield put({ type: CLEAE_ERROR_MESSAGE });
    const time = yield select(state => state.base.errorMessage.showTime);
    yield delay(time * 1000);
    yield put({ type: CLEAE_ERROR_MESSAGE });
  });
};
export default { reducers, effects };
